<template>
  <div>
    <BasicTable @register="registerTable" :rowSelection="rowSelection">
      <template #toolbar>
        <a-button type="primary" @click="handleGiveUserGoods()"> 赠送体验券</a-button>
        <a-button type="primary" @click="handleGiveUserGoodsServer(selectedRow)"> 权益管理</a-button>
      </template>
      <template #action="{ record }">
        <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)" />
      </template>
    </BasicTable>
    <GiveUserGoodsDrawer @register="registerGiveUserGoodsDrawer" @success="handleSuccess"></GiveUserGoodsDrawer>
    <UserGoodsServerDrawer @register="registerUserGoodsServerDrawer"></UserGoodsServerDrawer>
    <GiveVipcardListDrawer @register="registerGiveVipcardListDrawer"></GiveVipcardListDrawer>
    <TiYanUserGoodsEditPrivatedataDrawer @register="registerTiYanUserGoodsEditPrivatedataDrawer" @success="handleSuccess"></TiYanUserGoodsEditPrivatedataDrawer>
    <UserGoodsAddCheckDrawer @register="registerUserGoodsAddCheckDrawer" @success="reload"></UserGoodsAddCheckDrawer>
  </div>
</template>
<script lang="ts" setup name="giveUserGoods">
import { ActionItem, BasicTable, TableAction } from '@apps/antd-admin/src/components/Table';
import { useDrawer } from '@apps/antd-admin/src/components/drawer';
import { useBaseTable } from '@apps/antd-admin/src/hooks';
import GiveUserGoodsDrawer from './components/GiveUserGoodsDrawer.vue';
import GiveVipcardListDrawer from './components/GiveVipcardListDrawer.vue';
import UserGoodsServerDrawer from '@apps/ant-bus/src/views/business/userManage/userGoods/components/UserGoodsServerDrawer.vue';
import TiYanUserGoodsEditPrivatedataDrawer from './components/TiYanUserGoodsEditPrivatedataDrawer.vue';
import UserGoodsAddCheckDrawer from '@apps/ant-bus/src/views/business/userManage/userGoods/components/UserGoodsAddCheckDrawer.vue';
import { columns, searchFormSchema } from './data/data';
import { Api, frozenSub } from './data/api';
import { useMessage } from '@apps/antd-admin/src/hooks/web/useMessage';

const [registerGiveUserGoodsDrawer, { openDrawer: openGiveUserGoodsDrawer }] = useDrawer();
const [registerGiveVipcardListDrawer, { openDrawer: openGiveVipcardListDrawer }] = useDrawer();
const [registerUserGoodsServerDrawer, { openDrawer: openUserGoodsServerDrawer }] = useDrawer();
const [registerTiYanUserGoodsEditPrivatedataDrawer, { openDrawer: openTiYanUserGoodsEditPrivatedataDrawer }] = useDrawer();
const [registerUserGoodsAddCheckDrawer, { openDrawer: openUserGoodsAddCheckDrawer }] = useDrawer();
const { prefixCls, tableContext, handleDelete, handleSuccess, handlePost, handleBatchDelete } = useBaseTable({
  designScope: 'giveUserGoods-template',
  tableProps: {
    //表格标题
    title: '赠送体验券列表',
    //主键字段
    rowKey: 'userGoodsId',
    //列表接口
    listUrl: Api.page,
    delUrl: Api.remove,
    //列表查询handler
    handlerName: 'giveUserGoodsListHandler',
    //列定义
    columns,
    //查询表单配置
    formConfig: {
      labelWidth: 120,
      schemas: searchFormSchema,
      showExportButton: true,
    },
    //操作列配置
    actionColumn: {
      width: 200,
      title: '操作',
      dataIndex: 'action',
      slots: { customRender: 'action' },
      fixed: 'right',
    },
    clickToRowSelect: true,
    rowSelection: {
      type: 'radio',
    },
  },
});

const [registerTable, { reload }, { rowSelection, hasSelectedRows, selectedRow }] = tableContext;
const { createMessage, createConfirm } = useMessage();
/**
 * 行内操作栏
 */
function getTableAction(record): ActionItem[] {
  return [
    {
      label: '完善资料',
      onClick: handlerEditPrivatedata.bind(null, record),
    },
    {
      label: '删除',
      popConfirm: {
        title: '是否确认删除',
        icon: 'ant-design:delete-outlined',
        confirm: handleDelete.bind(null, record),
      },
      auth: 'ACTION_deleteTiyanUserGoods',
    },
  ];
}

/**
 * 下拉操作栏
 */
function getDropDownAction(record): ActionItem[] {
  return [
    {
      label: '转赠记录',
      onClick: handlerLookGiveVipcardList.bind(null, record),
    },
    {
      label: '核验补录',
      onClick: handlerAddCheck.bind(null, record),
      auth: 'ACTION_userGoodsAddCheckRecord',
    },
    {
      label: '冻结',
      popConfirm: {
        title: '是否确认冻结',
        confirm: handleFreeze.bind(null, record),
      },
      ifShow: _action => {
        return record.vipCardState == 1;
      },
      auth: 'ACTION_tiyanUserGoodsFreeze',
    },
    {
      label: '解冻',
      popConfirm: {
        title: '是否确认解冻',
        confirm: handleUnFreeze.bind(null, record),
      },
      ifShow: _action => {
        return record.vipCardState == 5;
      },
      auth: 'ACTION_tiyanUserGoodsUnFreeze',
    },
  ];
}

function handleFreeze(record) {
  let vipCardNo = record.vipCardNo;
  let userGoodsId = record.userGoodsId;
  createConfirm({
    iconType: 'info',
    title: '确认冻结',
    content: '确认冻结卡号为' + vipCardNo + '的会员卡？',
    onOk: async () => {
      await frozenSub({ userGoodsId: userGoodsId, vipCardState: 5 });
      handleSuccess(true, {});
    },
    onCancel: async () => {},
  });
}

function handleUnFreeze(record) {
  let vipCardNo = record.vipCardNo;
  let userGoodsId = record.userGoodsId;
  createConfirm({
    iconType: 'info',
    title: '确认解冻',
    content: '确认解冻卡号为' + vipCardNo + '的会员卡？',
    onOk: async () => {
      await frozenSub({ userGoodsId: userGoodsId, vipCardState: 1 });
      handleSuccess(true, {});
    },
    onCancel: async () => {},
  });
}

function handlerAddCheck(record) {
  openUserGoodsAddCheckDrawer(true, {
    record,
    isUpdate: false,
  });
}

/**
 * 赠送体验券
 * @param record
 */
function handleGiveUserGoods() {
  openGiveUserGoodsDrawer(true, {
    isUpdate: false,
  });
}
/**
 * 转赠记录
 * @param record
 */
function handlerLookGiveVipcardList(record) {
  openGiveVipcardListDrawer(true, {
    record,
    isUpdate: false,
  });
}

/**
 * 体验券权益
 * @param record
 */
function handleGiveUserGoodsServer(record) {
  openUserGoodsServerDrawer(true, {
    record,
    isUpdate: false,
  });
}

/**
 * 体验券完善资料
 * @param record
 */
function handlerEditPrivatedata(record) {
  openTiYanUserGoodsEditPrivatedataDrawer(true, {
    record,
    isUpdate: true,
  });
}
</script>
